<script lang="ts" setup>
import { get, post, message, loadFile } from '@/utils'
import useModal from '@/hooks/useModal'
import useTable from '@/hooks/useTable'
import DictionaryModal from './DictionaryModal.vue'
const props = defineProps<{
  show: boolean
  id: string
  code: any
}>()
const emit = defineEmits(['update:show', 'reset', 'confirm'])
const formRef = ref()
const actionRef = ref()
const { formatColumns } = useTable()

const { store } = useModal()
const searchQuery = reactive({
  parentId: props.id,
})

const pagination = {
  showPageSize: true,
  pageSize: 20,
}
const request = (params: any, sort: any, filters: any): Promise<any> => {
  return new Promise((resolve, reject) => {
    const query = { ...params, size: params.pageSize }
    Reflect.deleteProperty(query, 'pageSize')
    get(
      {
        url: '/server-system/admin/dict/child-list',
        data: query,
      },
      ({ data, code }) => {
        resolve({
          data: data,
          total: data.length,
          success: code == 200,
        })
      }
    )
  })
}
const columns = formatColumns([
  { title: '字典编号', dataIndex: 'code', hideInSearch: false },
  { title: '字典名称', dataIndex: 'dictValue', hideInSearch: false },
  { title: '字典键值', dataIndex: 'dictKey' },
  {
    title: '封存',
    dataIndex: 'isSealed',
    valueEnum: {
      1: { text: '是', status: 'Error' },
      0: { text: '否', status: 'Success' },
    },
  },
  {
    title: '操作',
    slotName: 'operations',
    dataIndex: 'operations',
    width: 200,
    btnList: [
      {
        name: '编辑',
        handle: ({ record }) => store.handleShow(record),
      },

      {
        name: '删除',
        type: 'popconfirm',
        tip: '确认删除该数据吗?',
        handle: ({ record }) => {
          post({ url: '/server-system/admin/dict/remove?ids=' + record.id }, ({ code, msg }) => {
            if (code == 200) actionRef.value.reload()
            message({
              type: code == 200 ? 'success' : 'error',
              content: msg,
            })
          })
        },
      },
    ],
  },
])
</script>
<template>
  <CModal v-model:visible="props.show" width="1200px" :footer="false" title="字典配置" @cancel="emit('update:show', false)">
    <ProTable :columns="columns" :request="request" row-key="id" :form-ref="ref => (formRef = ref)" :pagination="pagination" header-title="" column-resizable :params="searchQuery" :bordered="{ cell: true }" :action-ref="ref => (actionRef = ref)">
      <template #option-render="{ dom, reset }">
        <component :is="dom[1]" />
        <component :is="dom[0]" />
        <a-button @click="store.handleShow({})" type="primary">
          <template #icon>
            <icon-plus />
          </template>
          新建</a-button
        >
      </template>
    </ProTable>
    <DictionaryModal v-if="store.show" v-model:show="store.show" :id="store.id" :parent-id="props.id" @confirm="actionRef.reload" :code="store.info.code || $props.code" />
  </CModal>
</template>
<style lang="less" scoped></style>
